import React,{lazy, Suspense} from 'react';
import { Redirect } from 'react-router-dom';
import ExerciseList from "../pages/ExerciseList";


const Home = lazy(() => import('../pages/Home'));
const Conference = lazy(() => import('../pages/Conference'));
const ConferenceAdd = lazy(() => import('../pages/ConferenceAdd'));
const TestHome = lazy(() => import('../pages/TestHome'));
const WeChat = lazy(() => import('../pages/WeChat'));
const Exercise = lazy(() => import('../pages/ExerciseList'));
const JSX = lazy(() => import('../pages/JSX'));

const SuspenseComponent = (Component: any) => (props: any) => {
    return (
        <Suspense fallback={null}>
            <Component {...props}></Component>
        </Suspense>
    )
};

export const ProRouter = [
    {
        path: '/',
        component: SuspenseComponent(Home),
        routes: [
            {
                path: '/',
                exact: true,
                render: () => (
                    <Redirect to={"/conference"}/>
                )
           },
            {
                path: '/wechat',
                component: SuspenseComponent(WeChat),
            },
            {
                path: '/home',
                component: SuspenseComponent(TestHome),
            },
            {
                path: "/conference",
                component: SuspenseComponent(Conference),
                exact: true,
                routes: [
                    {
                        path: '/recommend/add',
                        component: SuspenseComponent(ConferenceAdd)
                    }
                ]

            },
            {
                path: "/conference/add",
                component: SuspenseComponent(ConferenceAdd),
            },
            {
                path: "/exerciseList",
                component: SuspenseComponent(ExerciseList),
            },
            {
                path: "/exerciseJSX",
                component: SuspenseComponent(JSX),
            },
            {
                path: "/sdk",
                component: SuspenseComponent(JSX),
            },
        ]
    }
];